<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=141435df8ed61ac30f32cd57fd3d7b0c"></script>
		<script type="text/javascript" src="js/d3.v3.js"></script>
		<script src="js/MiuToolKit.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="js/LoadShopInfo.js"></script>
		<script type="text/javascript" src="js/LoadUserComment.js" charset="utf-8"></script>
		<script type="text/javascript" src="js/ShowMap.js"></script>
		<script type="text/javascript" src="js/redarmap.js"></script>
		<script src="js/ShowSequentialGraphic.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/ShowAreaGraphic.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/ShowLine.js" type="text/javascript" charset="utf-8"></script>
		<!-- Css ↓ -->
		<link rel="stylesheet" type="text/css" href="css/seq_css.css" />
		<link rel="stylesheet" type="text/css" href="css/DotMatrix.css" />
		<style type="text/css">
			
			#line_box {
				border: 2px solid #EEEEEE;
				border-radius: 6px;
				text-align: center;
				margin: 10px auto;
				width:800px;
			}
			
			.line_continer {
				margin: 30px auto;
				width: 600px;
				height: 300px;
				border: 1px solid #000;
			}
			
			.line_btn_list{
				margin: 10px auto;
				text-align: center;
			}
			
			.line_axis path,
			.line_axis line,
			.line {
				stroke: #000;
				fill: none;
			}
		</style>
		<title>大众点评可视化</title>
	</head>

	<body>
		<div id="allmap" style="height: 600px;width: 1200px;"></div>
		<div id="radarMap" style="height: 600px;width: 600px;"></div>
		
		<div id="seq_graphic">
			<div id="buttons">
				<input type="button" name="seq_pre_button" id="seq_pre_button" value="上一个月" />
				<input type="button" name="seq_next_button" id="seq_next_button" value="下一个月" />
			</div>

		</div>
		<div id="line_box">
			<div class="line_continer">
				<svg width="100%" height="100%"></svg>
			</div>
			<div id="line_btn_list" style="width: 800px;height:150px"></div>
		</div>

		<!--
			请保持该图在尾部
		-->
		<div id="tip_div">
			<div id="DotMatrixChart"></div>
	</body>

</html>
<script type="text/javascript">
	//显示百度地图
	var map = new BMap.Map("allmap");
	map.centerAndZoom("绵阳", 13);
	map.enableScrollWheelZoom(true);
	DataLoad(function() {
		ShowSeqGrap();
		ShowAreaGraphic();
		ShowLineGraphic();
	});
</script>